<template>
  <div class="loginConfigContent">
    <el-form :model="record" label-width="170px" label-position="right" ref="form" :rules="rules" style="margin:20px 0;">
      <el-form-item :label="$t('自动删除')" prop="time">
        <el-input v-emoji id="report-setting-time" v-model="record.time" style="width:150px;margin:0 0px;" size='small'></el-input>
        <div style="display:inline-block;width:170px;">{{$t('天前生成的报表')}}</div>
      </el-form-item>
      <el-form-item :label="$t('最多保存')" prop="num">
        <el-input v-emoji id="report-setting-num" v-model="record.num" style="width:150px;margin:0 0px;" size='small'></el-input>
        <div style="display:inline-block;width:170px;">{{$t('份报表')}}</div>
      </el-form-item>
    </el-form>
    <div style="color:#909399;font-size:12px;">{{$t('（每天6点左右进行检查）')}}</div>
    <el-button type="primary" style="margin-top:5px;" @click="logSave">{{$t('应 用')}}</el-button>
  </div>
</template>
<script>
import { setReportSetting, getReportSetting } from '@/api/system/logReport/reportSetting'
export default {
  name: 'ReportSetting',
  data () {
    var validateTime = (rule, value, callback) => {
      if (!String(value).trim()) {
        callback(new Error(this.$t('不能为空')))
      } else if (!this.isInteger(value)) {
        callback(new Error(this.$t('只能输入整数')))
      } else if (!this.isValued1To60(value)) {
        callback(new Error(this.$t('只能输入 1-60 的整数')))
      } else {
        callback()
      }
    }
    var validateNum = (rule, value, callback) => {
      if (!String(value).trim()) {
        callback(new Error(this.$t('不能为空')))
      } else if (!this.isInteger(value)) {
        callback(new Error(this.$t('只能输入整数')))
      } else if (!this.isValued1To60(value)) {
        callback(new Error(this.$t('只能输入 1-60 的整数')))
      } else {
        callback()
      }
    }
    return {
      record: {
        time: '',
        num: ''
      },
      rules: {
        time: [{ required: false, trigger: 'blur', validator: validateTime }],
        num: [{ required: false, trigger: 'blur', validator: validateNum }]
      }
    }
  },
  created () {
    getReportSetting().then(res => {
      if (res.status === 0) {
        this.record.time = res.info[0].keep_day
        this.record.num = res.info[0].keep_num
      }
    })
  },
  methods: {
    logSave () {
      this.$refs.form.validate(valid => {
        if (valid) {
          setReportSetting(this.record).then(res => {
            if (res.status === 0) {
              this.$message({
                message: this.$t('保存成功'),
                type: 'success'
              })
            }
          })
        }
      })
    },
    isInteger (value) {
      return (!isNaN(value) && (parseInt(value).toString().length === String(Number(value)).length))
    },

    // 配合 cli 框架无法输入负数，加入数值范围大小
    isValued1To60 (value) {
      return (Number(value) > 0 && Number(value) < 61)
    }
  }
}
</script>
<style lang="less" scoped>
.el-switch {
  /deep/ .el-switch__core {
    &::before {
      content: "停用";
      color: #fff;
      position: absolute;
      // font-size: 14px;
      transform: scale(0.85);
      left: 20px;
    }
  }
  &.switch-is-actived {
    /deep/ .el-switch__core {
      &::before {
        content: "启用";
        left: 10px;
        transform: scale(0.85);
      }
    }
  }
}
.loginConfigContent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
</style>
